import React, { useState } from 'react';
import { Select, Form } from 'antd';
import request from '@/utils/request';

export interface SelectProps {
  width?: number;
  cRef?: any;
  name?: any;
  label?: string;
  showSearch?: boolean;
  placeholder?: string;
  required?: boolean;
  labelInValue?: boolean;
  idValue?: boolean;
  onChange?: any;
  hidden?: boolean;
  setCurrent?: (item: any) => void,
}
const WhseSelect: React.FC<SelectProps> = (props: SelectProps) => {
  const [dataSource, setDataSource] = useState<any[]>([]);
  React.useEffect(() => {
    request('/api/services/app/Warehse/GetAll', {
      method: 'GET',
      params: {
        skipCount: 0,
        maxResultCount: 1000
      },
    }).then(
      (response) => {
        if (response) {
          if (response.success) {
            setDataSource(response.result.items);
          }
        }
      },
    );
  }, [setDataSource]);
  return (
    <Form.Item
      name={props.name}
      label={props.label}
      rules={[
        {
          required: props.required,
          message: (props.label ? props.label : props.placeholder) + '必填',
        },
      ]}
    >
      <Select
        showSearch={props.showSearch}
        placeholder={props.placeholder}
        filterOption={(input, option: any) =>
          option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
        }
        style={{ width: props.width }}
        labelInValue={props.labelInValue}
      >
        {dataSource?.map((item: any) => {
          return (
            <Select.Option key={item.warehouseCode} value={item.warehouseCode}>
              {item.description}
            </Select.Option>
          );
        })}
      </Select>
    </Form.Item>
  );
};

const OpMasterSelect: React.FC<SelectProps> = (props: SelectProps) => {
  const [dataSource, setDataSource] = useState<any[]>([]);
  React.useEffect(() => {
    request('/api/services/app/OpMaster/GetAll', {
      method: 'GET',
      params: {
        skipCount: 0,
        maxResultCount: 1000
      },
    }).then(
      (response) => {
        if (response) {
          if (response.success) {
            setDataSource(response.result.items);
          }
        }
      },
    );
  }, []);
  return (
    <Form.Item
      name={props.name}
      label={props.label}
      rules={[
        {
          required: props.required,
          message: (props.label ? props.label : props.placeholder) + '必填',
        },
      ]}
      hidden={props.hidden}
    >
      <Select
        showSearch={props.showSearch}
        placeholder={props.placeholder}
        filterOption={(input, option: any) =>
          option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
        }
        style={{ width: props.width }}
        labelInValue={props.labelInValue}
      >
        {dataSource?.map((item: any) => {
          return (
            <Select.Option key={item.id} value={item.opCode}>
              {item.opDesc}
            </Select.Option>
          );
        })}
      </Select>
    </Form.Item>
  );
};

const ResourceGrpSelect: React.FC<SelectProps> = (props: SelectProps) => {
  const [dataSource, setDataSource] = useState<any[]>([]);
  React.useEffect(() => {
    request('/api/services/app/ResourceGroup/GetAll', {
      method: 'GET',
      params: {
        skipCount: 0,
        maxResultCount: 1000
      },
    }).then(
      (response) => {
        if (response) {
          if (response.success) {
            setDataSource(response.result.items);
          }
        }
      },
    );
  }, []);
  return (
    <Form.Item
      name={props.name}
      label={props.label}
      rules={[
        {
          required: props.required,
          message: (props.label ? props.label : props.placeholder) + '必填',
        },
      ]}
    >
      <Select
        showSearch={props.showSearch}
        placeholder={props.placeholder}
        filterOption={(input, option: any) =>
          option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
        }
        style={{ width: props.width }}
        labelInValue={props.labelInValue}
      >
        {dataSource?.map((item: any) => {
          return (
            <Select.Option key={item.id} value={item.resourceGrpID}>
              {item.description}
            </Select.Option>
          );
        })}
      </Select>
    </Form.Item>
  );
};

const ResourceSelect: React.FC<SelectProps> = (props: SelectProps) => {
  const [dataSource, setDataSource] = useState<any[]>([]);
  React.useEffect(() => {
    request('/api/services/app/Resource/GetAll', {
      method: 'GET',
      params: {
        skipCount: 0,
        maxResultCount: 1000
      },
    }).then(
      (response) => {
        if (response) {
          if (response.success) {
            setDataSource(response.result.items);
          }
        }
      },
    );
  }, []);
  return (
    <Form.Item
      name={props.name}
      label={props.label}
      rules={[
        {
          required: props.required,
          message: (props.label ? props.label : props.placeholder) + '必填',
        },
      ]}
    >
      <Select
        showSearch={props.showSearch}
        placeholder={props.placeholder}
        filterOption={(input, option: any) =>
          option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
        }
        style={{ width: props.width }}
        labelInValue={props.labelInValue}
      >
        {dataSource?.map((item: any) => {
          return (
            <Select.Option key={item.id} value={item.resourceID}>
              {item.description}
            </Select.Option>
          );
        })}
      </Select>
    </Form.Item>
  );
};

const VendorSelect: React.FC<SelectProps> = (props: SelectProps) => {
  const [dataSource, setDataSource] = useState<any[]>([]);
  React.useEffect(() => {
    request('/api/services/app/Vendor/GetAll', {
      method: 'GET',
      params: {
        skipCount: 0,
        maxResultCount: 1000
      },
    }).then(
      (response) => {
        if (response) {
          if (response.success) {
            setDataSource(response.result.items);
          }
        }
      },
    );
  }, []);
  return (
    <Form.Item
      name={props.name}
      label={props.label}
      rules={[
        {
          required: props.required,
          message: (props.label ? props.label : props.placeholder) + '必填',
        },
      ]}
    >
      <Select
        showSearch={props.showSearch}
        placeholder={props.placeholder}
        filterOption={(input, option: any) =>
          option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
        }
        style={{ width: props.width }}
        labelInValue={props.labelInValue}
        onChange={(e) => props.setCurrent ? props.setCurrent(e) : undefined}
      >
        {dataSource?.map((item: any) => {
          return (
            <Select.Option value={item.vendorNum} key={item.id}>
              {item.name}
            </Select.Option>
          );
        })}
      </Select>
    </Form.Item>
  );
};

const DeptSelect: React.FC<SelectProps> = (props: SelectProps) => {
  const [dataSource, setDataSource] = useState<any[]>([]);
  React.useEffect(() => {
    request('/api/services/app/Department/GetAll', {
      method: 'GET',
      params: {
        skipCount: 0,
        maxResultCount: 1000
      },
    }).then(
      (response) => {
        if (response) {
          if (response.success) {
            setDataSource(response.result.items);
          }
        }
      },
    );
  }, []);
  return (
    <Form.Item
      name={props.name}
      label={props.label}
      rules={[
        {
          required: props.required,
          message: (props.label ? props.label : props.placeholder) + '必填',
        },
      ]}
    >
      <Select
        showSearch={props.showSearch}
        placeholder={props.placeholder}
        filterOption={(input, option: any) =>
          option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
        }
        style={{ width: props.width }}
        labelInValue={props.labelInValue}
      >
        {dataSource?.map((item: any) => {
          return (
            <Select.Option key={item.id} value={props.idValue ? item.id : item.deptIndex}>
              {item.deptName}
            </Select.Option>
          );
        })}
      </Select>
    </Form.Item>
  );
};

const EmpSelect: React.FC<SelectProps> = (props: SelectProps) => {
  const [dataSource, setDataSource] = useState<any[]>([]);
  React.useEffect(() => {
    request('/api/services/app/Employee/GetAll', {
      method: 'GET',
      params: {
        skipCount: 0,
        maxResultCount: 1000
      },
    }).then(
      (response) => {
        if (response) {
          if (response.success) {
            setDataSource(response.result.items);
          }
        }
      },
    );
  }, []);
  return (
    <Form.Item
      name={props.name}
      label={props.label}
      rules={[
        {
          required: props.required,
          message: (props.label ? props.label : props.placeholder) + '必填',
        },
      ]}
    >
      <Select
        onChange={props.onChange}
        showSearch={props.showSearch}
        placeholder={props.placeholder}
        filterOption={(input, option: any) =>
          option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
        }
        style={{ width: props.width }}
        labelInValue={props.labelInValue}
      >
        {dataSource?.map((item: any) => {
          return (
            <Select.Option value={item.empName} key={item.id}>
              {item.empName}
            </Select.Option>
          );
        })}
      </Select>
    </Form.Item>
  );
};

const CustSelect: React.FC<SelectProps> = (props: SelectProps) => {
  const [dataSource, setDataSource] = useState<any[]>([]);
  React.useEffect(() => {
    request('/api/services/app/Customers/GetAll', {
      method: 'GET',
      params: {
        skipCount: 0,
        maxResultCount: 1000
      },
    }).then(
      (response) => {
        if (response) {
          if (response.success) {
            setDataSource(response.result.items);
          }
        }
      },
    );
  }, []);
  return (
    <Form.Item
      name={props.name}
      label={props.label}
      rules={[
        {
          required: props.required,
          message: (props.label ? props.label : props.placeholder) + '必填',
        },
      ]}
    >
      <Select
        onChange={props.onChange}
        showSearch={props.showSearch}
        placeholder={props.placeholder}
        filterOption={(input, option: any) =>
          option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
        }
        style={{ width: props.width }}
        labelInValue={props.labelInValue}
      >
        {dataSource?.map((item: any) => {
          return (
            <Select.Option value={item.custNum} key={item.id}>
              {item.customerName}
            </Select.Option>
          );
        })}
      </Select>
    </Form.Item>
  );
};

export {
  WhseSelect,
  OpMasterSelect,
  ResourceGrpSelect,
  ResourceSelect,
  VendorSelect,
  DeptSelect,
  EmpSelect,
  CustSelect,
};
